import Vue from 'vue'
import VueRouter from 'vue-router'

import Film from '../views/Film/Film.vue'
import comingSoon from '../views/Film/son/ComingSoon.vue'
import nowPlaying from '../views/Film/son/NowPlaying.vue'
import detail from '../views/Film/Detail.vue'

import Cinema from '../views/Cinema/Cinema.vue'
import City from '../views/Cinema/City.vue'
import Search from '../views/Cinema/Search.vue'

import Center from '../views/Center/Center.vue'

import login from '../views/Login/Login.vue'

// 注册当前模块，其实已经注册了全局组件了 叫router-view
Vue.use(VueRouter)

// 路由配置信息
const routes = [
  {
    path: '/film',
    component: Film,
    children: [
      {
        path: 'nowPlaying', // 简写
        component: nowPlaying
      },
      {
        path: '/film/comingSoon',
        component: comingSoon
      },
      {
        path: '', // 重定向，进入 /film 默认跳转至nowPlaying页面
        redirect: '/film/nowPlaying'
      }
    ]
  },
  // {
  //   path: '/detail/:myid', // 动态路由 :只是占位符
  //   name: 'detail',
  //   component: detail
  // },
  {
    path: '/detail',
    component: detail
  },
  {
    path: '/cinema',
    component: Cinema
  },
  {
    path: '/city',
    component: City
  },
  {
    path: '/cinema/search',
    component: Search
  },
  {
    path: '/center',
    component: Center
  },
  {
    path: '/detail',
    component: detail
  },
  {
    path: '/login',
    component: login
  },
  {
    // 重定向  使用通配符，优先级最低，这样可以防止随便输入跳转
    path: '*',
    redirect: '/film'
  }
]

const router = new VueRouter({
  // 我们这里使用hash模式，完成单页面开发
  // 如果使用history模式，则需要后台的协助才能玩好
  // mode: 'history',
  // base: process.env.BASE_URL,
  routes
})

// 全局路由守卫
router.beforeEach((to, from, next) => {
  // const auth = ['/center', '/order', '/money', '/card']
  const auth = ['/order', '/money', '/card']
  if (auth.includes(to.fullPath)) {
    console.log('验证token')
    if (!localStorage.getItem('token')) {
      next('/login')
    } else {
      next()
    }
  } else {
    next()
  }
})

export default router
